<script setup>
import GetBack from '@/components/GetBack.vue';
</script>

<template>
    <GetBack class="getback">分区</GetBack>
   <div class="classfiy-main">
    <div class="classfiy">
        <img src="@/assets/img/fanju.png">
        <p>番剧</p>
    </div>
    <div class="classfiy">
        <img src="@/assets/img/guochuang.png">
        <p>国创</p>
    </div>
    <div class="classfiy">
        <img src="@/assets/img/fangyingting.png">
        <p>放映厅</p>
    </div>
    <div class="classfiy">
        <img src="@/assets/img/donghua.png">
        <p>动画</p>
    </div>
   </div>
</template>

<style scoped lang="less">
.classfiy-main {
    margin-top: 20px;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}
.classfiy {
    width: 20%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    img {
        width: 35%;
    }
    p {
        font-size: 12px;
        color: #4f4f51;
        font-weight: 600;
    }
}
</style>
